<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core"
                template="../templates/commonLayout.xhtml">
    <ui:define name="head">
        <script type="text/javascript" src="#{root}js/bootstrap-dropdown.js" />
        <script type="text/javascript" src="#{root}js/bootstrap-scrollspy.js" />
        <title>Página Scripts</title>
    </ui:define> 
    <ui:define name="content">
        <div class="subnav">
            <ul class="nav nav-pills">                
                <li>
                    <h:outputLink value="#{root}pizarra/pizarra.jsf" >
                        <h:outputText value="#{msgs.pizarra}"/>
                    </h:outputLink>
                </li>
                <li>
                    <h:outputLink value="#{root}tarea/backlog.jsf" >
                        <h:outputText value="#{msgs.backlog}"/>
                    </h:outputLink>
                </li>
                <li>
                    <h:outputLink value="#{root}sprint/schedule.jsf" >
                        <h:outputText value="#{msgs.calendario}"/>
                    </h:outputLink>
                </li>
                <li>
                    <h:outputLink value="#{root}chart/burndown.jsf" >
                        <h:outputText value="#{msgs.burndown}"/>
                    </h:outputLink>
                </li>
                <li>
                    <h:outputLink value="#{root}sprint/new.jsf" >
                        <h:outputText value="#{msgs.nuevoSprint}"/>
                    </h:outputLink>
                </li>                
            </ul>
        </div>
        <c:choose>
            <c:when test="${not empty nuevoSprintBean.creado}">
                <h:outputText class="hidden" value="#{msgs.producto}: #{listadoSprintBean.bean.productoActual}"/><br/>
                <h:outputText class="hidden" value="#{msgs.sprint}: #{listadoSprintBean.bean.sprintActual}"/>
                <h3><h:outputText value="#{msgs.sprints}"/></h3> 
                <br/>
                <div align="center">
                    <p:outputPanel id="display" style="display:block;margin-top:10px;">

                        <p:dataTable id="lstSprints2" 
                                     var="sprint" 
                                     value="#{sprintBean.sprints}" 
                                     rowKey="#{sprint.id}"
                                     selection="#{sprintBean.selectedSprint}"
                                     rowStyleClass="#{listadoSprintBean.bean.sprintActual eq sprint.id ? 'ui-state-highlight-special' : null}">  >  

                            <f:facet name="header">
                                <h:outputText value="#{msgs.sprintProducto}"/>
                            </f:facet>              
                            <p:column headerText="#{msgs.fechaInicio}">  
                                <h:outputText value="#{sprint.fecini}">
                                    <f:convertDateTime pattern="dd/MM/yyyy" />
                                </h:outputText>                        
                            </p:column>  
                            <p:column headerText="#{msgs.fechaFin}">  
                                <h:outputText value="#{sprint.fecfin}">
                                    <f:convertDateTime pattern="dd/MM/yyyy" />
                                </h:outputText>
                            </p:column>  
                            <p:column headerText="#{msgs.descripcion}">  
                                <h:outputText value="#{sprint.des}" />  
                            </p:column>  

                        </p:dataTable>
                    </p:outputPanel>

                </div>
            </c:when>                
            <c:when test="${listadoSprintBean.bean.sprintActual eq '-1'}">
                <script type="text/javascript" src="#{root}js/locales.js" />
                <h:form>
                    <br/>
                    <h3><h:outputText value="#{msgs.nuevoSprint}"/></h3> 
                    <br/></h:form>
                <div align="center">
                    <p:outputPanel id="display"  style="display:block;margin-top:10px;">
                        <h:form id="tablaSprint"> 
                            <p:contextMenu for="lstSprints">
                                <p:menuitem value="#{msgs.eliminar}" 
                                            icon="ui-icon-close" 
                                            ajax="false"
                                            action="#{sprintBean.deleteSprint}"/>
                            </p:contextMenu>

                            <p:dataTable id="lstSprints" 
                                         var="sprint" 
                                         value="#{sprintBean.sprints}" 
                                         rowKey="#{sprint.id}"
                                         selection="#{sprintBean.selectedSprint}" 
                                         selectionMode="single">  

                                <f:facet name="header">
                                    <h:outputText value="#{msgs.sprintProducto}"/>
                                </f:facet>              
                                <p:column headerText="#{msgs.fechaInicio}">  
                                    <h:outputText value="#{sprint.fecini}">
                                        <f:convertDateTime pattern="dd/MM/yyyy" />
                                    </h:outputText>                        
                                </p:column>  
                                <p:column headerText="#{msgs.fechaFin}">  
                                    <h:outputText value="#{sprint.fecfin}">
                                        <f:convertDateTime pattern="dd/MM/yyyy" />
                                    </h:outputText>
                                </p:column>  
                                <p:column headerText="#{msgs.descripcion}">  
                                    <h:outputText value="#{sprint.des}" />  
                                </p:column>  

                            </p:dataTable>
                        </h:form>
                    </p:outputPanel>

                </div>
                <h:form>
                    <br/>
                    <p:separator style="height: 5px"/>
                    <br/>

                    <div align="center">
                        <p:panelGrid id="grid" columns="2" cellspacing="10px"  cellpadding="5px">
                            <f:facet name="header">
                                <h:outputText value="#{msgs.nuevoSprint}"/>
                            </f:facet>                

                            <h:outputLabel value="#{msgs.fechaInicio}: "/>
                            <p:calendar locale="es" navigator="true" value="#{sprintBean.fecini}" id="fechaInicio" required="true"/>

                            <h:outputLabel value="#{msgs.fechaFin}: "/>
                            <p:calendar locale="es" navigator="true" value="#{sprintBean.fecfin}" id="fechaFinalizacion" required="true" />

                            <h:outputLabel value="#{msgs.descripcion}: "/>
                            <p:inputText value="#{sprintBean.des}" id="descripcion" required="true" />
                        </p:panelGrid>   
                        <h:outputLabel value="#{sprintBean.error}"  id="error" style="font-weight: bold;color:red"/>
                        <br/>
                        <p:commandButton ajax="false" value="#{msgs.guardar}" action="#{sprintBean.guardar}" />
                    </div>
                </h:form>
                <style>
                    .subnav {
                        display: none;
                    }
                </style>
            </c:when>
            <c:otherwise>
                <h:outputText class="hidden" value="Producto: #{listadoSprintBean.bean.productoActual}"/><br/>
                <h:outputText class="hidden" value="Sprint: #{listadoSprintBean.bean.sprintActual}"/>
                <h3><h:outputText value="#{msgs.sprints}"/></h3> 
                <br/>
                <div align="center">
                    <p:outputPanel id="display"  style="display:block;margin-top:10px;">

                        <p:dataTable id="lstSprints" 
                                     var="sprint" 
                                     value="#{sprintBean.sprints}" 
                                     rowKey="#{sprint.id}"
                                     selection="#{sprintBean.selectedSprint}"
                                     rowStyleClass="#{listadoSprintBean.bean.sprintActual eq sprint.id ? 'ui-state-highlight-special' : null}">  

                            <f:facet name="header">
                                <h:outputText value="#{msgs.sprintProducto}"/>
                            </f:facet>              
                            <p:column headerText="#{msgs.fechaInicio}">  
                                <h:outputText value="#{sprint.fecini}">
                                    <f:convertDateTime pattern="dd/MM/yyyy" />
                                </h:outputText>                        
                            </p:column>  
                            <p:column headerText="#{msgs.fechaFin}">  
                                <h:outputText value="#{sprint.fecfin}">
                                    <f:convertDateTime pattern="dd/MM/yyyy" />
                                </h:outputText>
                            </p:column>  
                            <p:column headerText="#{msgs.descripcion}">
                                <h:outputText class="yeee" value="#{sprint.des}" />                             
                            </p:column>  

                        </p:dataTable>
                    </p:outputPanel>

                </div>
            </c:otherwise>
        </c:choose>

    </ui:define>
</ui:composition>
